<template>
  <!--	这个必须加否则页面整体出现下拉情况-->
  <!--	@touchmove.stop.prevent="() => {}"-->
  <gui-page ref="guiPage" :fullPage="true">
    <template v-slot:gBody>
      <!-- #ifdef MP -->
      <view class="status_bar">
        <!-- 这里是状态栏 -->
      </view>
      <view class="status_bar">
        <!-- 这里是状态栏 -->
      </view>
      <!-- #endif -->

      <!-- #ifdef APP-PLUS -->
      <view class="status_bar">
        <!-- 这里是状态栏 -->
      </view>
      <!-- #endif -->

      <view class="gui-flex1 gui-flex gui-column">
        <view style="height: 92.8rpx; background: #f8f8f8"></view>

        <view
          id="header"
          class="search-fixed-top gui-bg-white"
          style="padding: 10rpx 30rpx"
        >
          <!-- #ifdef MP -->

          <view class="status_bar">
            <!-- 这里是状态栏 -->
          </view>
          <view class="status_bar">
            <!-- 这里是状态栏 -->
          </view>
          <!-- #endif -->

          <!-- #ifdef APP-PLUS -->
          <view class="status_bar">
            <!-- 这里是状态栏 -->
          </view>
          <!-- #endif -->

          <!--					因为右侧有胶囊所以需要偏左显示-->
          <!-- #ifdef MP -->
          <view style="width: 60%">
            <!-- #endif -->

            <gui-switch-navigation
              :activeLineClass="['gui-xhs-red']"
              :isCenter="true"
              activeDirection="center"
              textAlign="center"
              :items="tabs"
              :size="150"
              :currentIndex="currentIndex"
              @change="navchange"
            >
            </gui-switch-navigation>

            <!-- #ifdef MP -->
          </view>
          <!-- #endif -->

          <view
            class="search-icon"
            @tap="searchNote"
            style="
              position: absolute;
              right: 110rpx;
              top: 0;
              z-index: 999;
              height: 78rpx;
              line-height: 78rpx;
            "
          >
            <text style="color: #373737" class="gui-icons xhs-font35"
              >&#xe604;</text
            >
          </view>
        </view>

        <swiper
          :current="currentIndex"
          @change="swiperChange"
          :style="{ height: swiperHeight + 100 + 'px', width: '750rpx' }"
        >
          <!-- 轮播项目数量对应 上面的选项标签 -->
          <swiper-item class="gui-bg-gray">
            <view id="content-wrap1" style="padding: 0 15rpx">
              <view class="gui-flex gui-row gui-space-between">
                <view
                  class="gui-waterfall-item"
                  v-for="(lists, index1) in noteList1"
                  :key="index1"
                >
                  <view
                    :id="'waterfall1' + index1 + index2"
                    @tap="goDetail(notes)"
                    class="gui-waterfall-items gui-bg-white gui-border-radius"
                    style="overflow: hidden; padding-bottom: 10rpx"
                    v-for="(notes, index2) in lists"
                    :key="index2"
                  >
                    <gui-image
                      @imgLoad="imgLoad"
                      :src="notes.firstPicture"
                      :width="355"
                    ></gui-image>
                    <view
                      class="gui-text gui-primary-text xhs-margin-top-15 xhs-font30"
                      style="color: #333333; margin-left: 16rpx"
                      ><text>{{ notes.noteTitle }}</text></view
                    >
                    <view
                      class="gui-flex gui-row gui-space-between xhs-margin-top-15"
                    >
                      <view style="width: 28px; height: 28px">
                        <image
                          style="width: 28px; height: 28px; margin-left: 16rpx"
                          class="gui-list-image ucenter-face-image"
                          :src="notes.authorAvatar"
                          mode="aspectFill"
                        ></image>
                      </view>
                      <!--														负值越小越往左-->
                      <view
                        style="
                          font-size: 22rpx;
                          color: #5a5a5a;
                          margin-left: 20rpx;
                          line-height: 29rpx;
                          width: 200rpx;
                        "
                      >
                        <text>{{ notes.authorName }}</text>
                        <br />
                        <text style="color: #acacac">{{
                          formatDate(notes.createTime)
                        }}</text>
                      </view>

                      <view
                        style="
                          margin-right: 16rpx;
                          color: #acacac;
                          line-height: 32rpx;
                          font-size: 24rpx;
                          text-align: center;
                        "
                        @tap.stop="upNote(notes)"
                      >
                        <text
                          :class="[
                            'gui-icons',
                            'gui-block',
                            'ranking-lists-zan-icon',
                            notes.isUp ? 'zan-active' : '',
                          ]"
                          >{{ notes.isUp ? "&#xe605;" : "&#xe6ad;"
                          }}<text style="color: #5a5a5a; margin-left: 5rpx">
                            {{ notes.upCount }}</text
                          ></text
                        >
                      </view>
                    </view>
                  </view>
                </view>
              </view>
            </view>

            <!-- 加载组件 -->
            <gui-loadmore
              v-show="currentIndex == 0"
              ref="loadmorecom1"
              :status="1"
            ></gui-loadmore>
          </swiper-item>
          <swiper-item class="gui-bg-gray">
            <view class="gui-relative gui-flex gui-bg-white">
              <gui-switch-navigation-shopping
                style="width: 100%"
                :size="150"
                lineHeight="60rpx"
                :activeLineClass="['gui-xhs-red']"
                :items="categoryTabs"
                activeDirection="center"
                textAlign="center"
                :currentIndex="currentCategoryIndex"
                @change="navchangeCategories"
              >
              </gui-switch-navigation-shopping>
            </view>
            <view
              v-if="showPromotion"
              class="gui-bg-white gui-dark-bg-level-3 gui-padding-x"
              style="margin-bottom: 15rpx"
            >
              <gui-speaker :items="speakerMsgs">
                <template v-slot:icon>
                  <text class="gui-icons demo-icon gui-primary-color"
                    >&#xe656;</text
                  >
                </template>
              </gui-speaker>
            </view>
            <!--									数值越大中间边距越小-->
            <view id="content-wrap2" style="padding: 0 15rpx">
              <view
                class="gui-flex gui-row gui-space-between"
                style="margin-top: 15rpx"
              >
                <view
                  class="gui-waterfall-item"
                  v-for="(lists, index1) in noteList2"
                  :key="index1"
                >
                  <view
                    :id="'waterfall2' + index1 + index2"
                    @tap="goDetail(notes)"
                    class="gui-waterfall-items gui-bg-white gui-border-radius gui-relative"
                    style="overflow: hidden; padding-bottom: 8rpx"
                    v-for="(notes, index2) in lists"
                    :key="index2"
                  >
                    <text
                      v-if="notes.noteType == 1"
                      style="width: 130rpx"
                      class="gui-card-tip gui-border-radius gui-absolute-rt gui-text-small gui-color-white gui-bg-black-opacity5"
                      >图文笔记</text
                    >
                    <text
                      v-if="notes.noteType == 2"
                      style="width: 130rpx"
                      class="gui-card-tip gui-border-radius gui-absolute-rt gui-text-small gui-color-white gui-bg-black-opacity5"
                      >视频笔记</text
                    >
                    <text
                      v-if="notes.noteType == 3"
                      style="width: 130rpx"
                      class="gui-card-tip gui-border-radius gui-absolute-rt gui-text-small gui-color-white gui-bg-black-opacity5"
                      >音乐笔记</text
                    >

                    <gui-image
                      @imgLoad="imgLoad"
                      :src="notes.firstPicture"
                      :width="355"
                    ></gui-image>
                    <view
                      class="gui-text gui-primary-text xhs-margin-top-15 xhs-font30"
                      style="color: #333333; margin-left: 16rpx"
                      ><text>{{ notes.noteTitle }}</text></view
                    >
                    <view
                      class="gui-flex gui-row gui-space-between xhs-margin-top-15"
                    >
                      <view>
                        <image
                          style="width: 28px; height: 28px; margin-left: 16rpx"
                          class="gui-list-image ucenter-face-image"
                          :src="notes.authorAvatar"
                          mode="aspectFill"
                        ></image>
                      </view>
                      <!--														负值越小越往左-->
                      <view
                        style="
                          font-size: 24rpx;
                          color: #5a5a5a;
                          line-height: 60rpx;
                          width: 200rpx;
                        "
                      >
                        <text>{{ notes.authorName }}</text>
                        <!--															<br/>-->
                        <!--															<text style="color:#ACACAC;">{{notes.createTimeStr}}</text>-->
                      </view>

                      <view
                        style="
                          margin-right: 16rpx;
                          color: #acacac;
                          line-height: 42rpx;
                          font-size: 28rpx;
                          text-align: center;
                        "
                        @tap.stop="upNote(notes)"
                      >
                        <text
                          :class="[
                            'gui-icons',
                            'gui-block',
                            'ranking-lists-zan-icon',
                            notes.isUp ? 'zan-active ' : '',
                          ]"
                          >{{ notes.isUp ? "&#xe605;" : "&#xe6ad;"
                          }}<text style="color: #5a5a5a; margin-left: 5rpx">
                            {{ notes.upCount }}</text
                          >
                        </text>
                      </view>
                    </view>
                  </view>
                </view>
              </view>
            </view>
            <gui-loadmore
              v-show="currentIndex == 1"
              ref="loadmorecom2"
              :status="1"
            ></gui-loadmore>
          </swiper-item>
          <swiper-item class="gui-bg-gray">
            <!--									数值越大中间边距越小-->
            <view id="content-wrap3" style="padding: 0 15rpx">
              <view class="gui-flex gui-row gui-space-between">
                <view
                  class="gui-waterfall-item"
                  v-for="(lists, index1) in noteList3"
                  :key="index1"
                >
                  <view
                    :id="'waterfall3' + index1 + index2"
                    @tap="goDetail(notes)"
                    class="gui-waterfall-items gui-bg-white gui-border-radius"
                    style="overflow: hidden; padding-bottom: 8rpx"
                    v-for="(notes, index2) in lists"
                    :key="index2"
                  >
                    <gui-image
                      @imgLoad="imgLoad"
                      :src="notes.firstPicture"
                      :width="355"
                    ></gui-image>
                    <view
                      class="gui-text gui-primary-text xhs-margin-top-15 xhs-font30"
                      style="color: #333333; margin-left: 16rpx"
                      ><text>{{ notes.noteTitle }}</text></view
                    >
                    <view
                      class="gui-flex gui-row gui-space-between xhs-margin-top-15"
                    >
                      <view>
                        <image
                          style="width: 28px; height: 28px; margin-left: 16rpx"
                          class="gui-list-image ucenter-face-image"
                          :src="notes.authorAvatar"
                          mode="aspectFill"
                        ></image>
                      </view>
                      <view
                        style="
                          font-size: 24rpx;
                          color: #5a5a5a;
                          line-height: 60rpx;
                          width: 200rpx;
                        "
                      >
                        <text>{{ notes.authorName }}</text>
                        <!--															<br/>-->
                        <!--															<text style="color:#ACACAC;">{{notes.createTimeStr}}</text>-->
                      </view>

                      <view
                        style="
                          margin-right: 16rpx;
                          color: #acacac;
                          line-height: 42rpx;
                          font-size: 28rpx;
                          text-align: center;
                        "
                        @tap.stop="upNote(notes)"
                      >
                        <text
                          :class="[
                            'gui-icons',
                            'gui-block',
                            'ranking-lists-zan-icon',
                            notes.isUp ? 'zan-active' : '',
                          ]"
                        >
                          {{ notes.isUp ? "&#xe605;" : "&#xe6ad;" }}
                          <text style="color: #5a5a5a; margin-left: 5rpx">
                            {{ notes.upCount }}</text
                          >
                        </text>
                      </view>
                    </view>
                  </view>
                </view>
              </view>
            </view>

            <gui-loadmore
              v-show="currentIndex == 2"
              ref="loadmorecom3"
              :status="1"
            ></gui-loadmore>
          </swiper-item>
        </swiper>
      </view>
    </template>
  </gui-page>
</template>
<script>
import graceJS from "@/Grace6/js/grace.js";
import getWebSocketClient from "@/Grace6/js/ws";
// 模拟数据
import dataObj from "@/Grace6/demoData/data.js";
import GuiImage from "../../Grace6/components/gui-image.vue";
import graceRequestConfig from "@/custom/graceRequestConfig.js";
import commonMixin from "@/mixin/commonMinxin";
export default {
  mixins: [commonMixin],
  components: { GuiImage },
  data() {
    return {
      showPromotion: false,
      speakerMsgs: [{ title: "商务　微信: dadait24　qq: 727869402" }],
      loaded: false,
      // 全屏 loading
      // 顶部选项卡标签
      tabs: [
        { id: 1, name: "关注" },
        { id: 2, name: "发现" },
        { id: 3, name: "郑州" },
      ],
      // 顶部选项卡标签 选中选项的 索引
      currentIndex: 1,
      swiperHeight: 0,
      defaultSwiperHeight: 0,
      noteList1: [[], []],
      noteList2: [[], []],
      noteList3: [[], []],
      // 用于记录是否有 api 请求正在执行
      apiLoadingStatus1: false,
      apiLoadingStatus2: false,
      apiLoadingStatus3: false,
      page1: 1,
      page2: 1,
      page3: 1,
      loadMoreTimer1: null,
      loadMoreTimer2: null,
      loadMoreTimer3: null,
      categoryTabs: [],
      currentCategoryIndex: 0,
      isFixed: false,
      menuHeight: 60,
    };
  },
  computed: {
    categoryNames() {
      return this.categoryTabs.map((tab) => tab.name);
    },
  },
  watch: {
    currentIndex(newVal, OldVal) {
      if (this.currentIndex != 1) {
        uni.app.checkLogin();
      }
      this.$nextTick(() => {
        //切换时刷新高度
        this.setSwiperHeight(this.currentIndex + 1);
      });
    },
  },
  methods: {
    searchNote() {
      uni.navigateTo({
        url: "/pages/search/search",
      });
    },
    //格式化时间
    formatDate(date) {
      return uni.app.formatDate(date);
    },
    //获取当前ip
    getIpAddress() {
      uni.app.get("/getIpAddress", "", "", (res) => {
        console.log(res.data);
        this.tabs[2].name = res.data;
        this.getNotes3();
      });
    },
    //点赞笔记
    upNote(notes) {
      uni.app.post("/auth/upNote", notes, "json", "", (res) => {
        console.log(res.data);
        if (res.data) {
          notes.isUp = true;
          notes.upCount++;
        } else {
          notes.isUp = false;
          notes.upCount--;
        }
      });
    },
    //图片加载成功后重新 计算高度防止高度不够无法滑动
    imgLoad() {
      this.$nextTick(() => {
        this.setSwiperHeight(this.currentIndex + 1);
      });
    },
    //计算高度
    setSwiperHeight(i) {
      var swiperHeightTimer = null;
      if (swiperHeightTimer != null) {
        clearTimeout(swiperHeightTimer);
      }
      swiperHeightTimer = setTimeout(() => {
        // console.log('设置了高度')
        let element = "#content-wrap" + i.toString();
        // console.log(element)
        let query = uni.createSelectorQuery().in(this);
        query.select(element).boundingClientRect();
        query.exec((res) => {
          // console.log(res)
          if (res && res[0]) {
            // console.log('当前Swiper'+ i +'高度' + res[0].height)
            if (
              res[0].height == 0 ||
              res[0].height < this.defaultSwiperHeight
            ) {
              // console.log('当前高度小于默认高度' + this.defaultSwiperHeight)
              this.swiperHeight = this.defaultSwiperHeight;
            } else {
              this.swiperHeight = res[0].height;
            }
            // console.log('赋值了高度 当前currentIndex+1=' + (this.currentIndex+1) +' getNodes监听的数据' + this.swiperHeight)
          }
        });
      }, 100);
    },
    navchange: function (index) {
      this.currentIndex = index;
    },
    swiperChange: function (e) {
      var index = e.detail.current;
      this.currentIndex = index;
    },
    //进入详情
    goDetail(e) {
      let checkLogin = uni.app.checkLogin();
      if (checkLogin) {
        if (e.noteType == 1) {
          uni.navigateTo({
            url: "/pages/notes/detail/detail?noteId=" + e.noteId,
          });
        } else if (e.noteType == 2) {
          uni.navigateTo({
            url: "/pages/notes/videoDetail/videoDetail?noteId=" + e.noteId,
          });
        } else if (e.noteType == 3) {
          uni.navigateTo({
            url: "/pages/notes/musicDetail/musicDetail?noteId=" + e.noteId,
          });
        }
      }
    },
    getNotes1(isReload) {
      // console.log('我开始请求了')
      this.apiLoadingStatus1 = true;
      const that = this;
      uni.app.post(
        "/auth/getFollowNotes",
        { limit: 6, page: this.page1 },
        "",
        "",
        (res) => {
          if (res.code == 200) {
            console.log("getNotes1当前页" + that.page1);
            console.log("总页数" + res.data.pages);
            if (that.page1 <= res.data.pages) {
              let notes = res.data.records;
              //填充数组[此处的 notes 数据应该来自与api接口数据]
              //数据格式见 "/data/data.js"
              for (var i = 0; i < notes.length; i++) {
                if (i % 2 == 0) {
                  that.noteList1[0].push(notes[i]);
                } else {
                  that.noteList1[1].push(notes[i]);
                }
              }
              this.$nextTick(() => {
                this.setSwiperHeight(1);
              });
              if (that.page1 == res.data.pages) {
                this.$refs.loadmorecom1.nomore();
              } else {
                that.page1 = that.page1 + 1;
                this.$refs.loadmorecom1.stoploadmore();
              }
              that.apiLoadingStatus1 = false;
            } else if (res.data.pages == 0) {
              that.apiLoadingStatus1 = false;
              this.$refs.loadmorecom1.nomore();
            }
            if (isReload) {
              uni.stopPullDownRefresh();
            }
          }
        },
      );
    },
    getNotes2(isReload) {
      // console.log('我开始请求了')
      this.apiLoadingStatus2 = true;
      const that = this;
      let params = {
        authorId: "08325cbcaee44a8197d18af3e89b47fb",
        authorIds: "08325cbcaee44a8197d18af3e89b47fb",
        followId: "08325cbcaee44a8197d18af3e89b47fb",
        ipRealAddress: "",
        keyword: "",
        limit: 10,
        myStarById: "",
        myUpById: "",
        noteCategory: 0,
        noteId: "",
        noteTitle: "",
        offset: 1,
      };
      if (
        this.categoryTabs.length > 0 &&
        this.categoryTabs[this.currentCategoryIndex].id
      ) {
        params.noteCategory = this.categoryTabs[this.currentCategoryIndex].id;
      }
      uni.app.post("/blog/home/getNotes", params, "", "", (res) => {
        if (res.code == 200) {
          console.log("getNotes2当前页" + that.page2);
          console.log("总页数" + res.data.pages);
          if (that.page2 <= res.data.pages) {
            let notes = res.data.records;
            //填充数组[此处的 notes 数据应该来自与api接口数据]
            //数据格式见 "/data/data.js"
            for (var i = 0; i < notes.length; i++) {
              if (i % 2 == 0) {
                that.noteList2[0].push(notes[i]);
              } else {
                that.noteList2[1].push(notes[i]);
              }
            }
            this.$nextTick(() => {
              this.setSwiperHeight(2);
            });
            if (that.page2 == res.data.pages) {
              this.$refs.loadmorecom2.nomore();
            } else {
              that.page2++;
              this.$refs.loadmorecom2.stoploadmore();
            }
            that.apiLoadingStatus2 = false;
          } else if (res.data.pages == 0) {
            this.$refs.loadmorecom2.nomore();
            that.apiLoadingStatus2 = false;
          }
          if (isReload) {
            uni.stopPullDownRefresh();
          }
        }
      });
    },
    getNotes3(isReload) {
      this.apiLoadingStatus3 = true;
      const that = this;
      uni.app.get(
        "/auth/notes",
        { limit: 6, page: this.page3, ipRealAddress: this.tabs[2].name },
        "",
        "",
        (res) => {
          if (res.code == 200) {
            console.log("getNotes3当前页" + that.page3);
            console.log("总页数" + res.data.pages);
            if (that.page3 <= res.data.pages) {
              let notes = res.data.records;

              for (var i = 0; i < notes.length; i++) {
                if (i % 2 == 0) {
                  that.noteList3[0].push(notes[i]);
                } else {
                  that.noteList3[1].push(notes[i]);
                }
              }
              this.$nextTick(() => {
                this.setSwiperHeight(3);
              });
              if (that.page3 == res.data.pages) {
                this.$refs.loadmorecom3.nomore();
              } else {
                that.page3++;
                this.$refs.loadmorecom3.stoploadmore();
              }
              that.apiLoadingStatus3 = false;
            } else if (res.data.pages == 0) {
              this.$refs.loadmorecom3.nomore();
              that.apiLoadingStatus3 = false;
            }
            if (isReload) {
              uni.stopPullDownRefresh();
            }
          }
        },
      );
    },
    navchangeCategories(index) {
      this.currentCategoryIndex = index;
      this.page2 = 1;
      this.noteList2 = [[], []];
      if (this.$refs.loadmorecom2) {
        this.$refs.loadmorecom2.stoploadmore();
      }
      this.getNotes2(true);
    },
    getCategories() {
      uni.app.get("/getCategories", {}, "", (res) => {
        if (res.code == 200) {
          const categories = res.data.map((c) => ({
            id: c.categoryId,
            name: c.categoryName,
          }));
          this.categoryTabs = [{ id: "", name: "推荐" }, ...categories];
          this.$nextTick(() => {
            this.setSwiperHeight(2);
          });
        }
      });
    },
    selectCategory(index, value) {
      this.navchangeCategories(index);
    },
  },
  //下拉刷新
  onPullDownRefresh: function () {
    if (this["apiLoadingStatus" + (this.currentIndex + 1)]) {
      uni.stopPullDownRefresh();
      return;
    }
    this["page" + (this.currentIndex + 1)] = 1;
    this["noteList" + (this.currentIndex + 1)] = [[], []];
    this["getNotes" + (this.currentIndex + 1)](true);
  },
  onShow() {
    console.log("onShow");
    console.log("this.loaded" + this.loaded);
    //证明不是第一次进页面了 刷新当前页

    // if(this.loaded){
    // 	this.$nextTick(() => {
    // 		for (let i = 0; i < 3; i++) {
    // 			this['page'+(i+1)] = 1;
    // 			this['noteList'+(i+1)] = [[],[]]
    // 			this['getNotes'+(i+1)](true);
    // 		}
    // 	})
    // }

    this.$nextTick(() => {
      // 因为在appvue 无法获取tabbar
      const wsClient = getWebSocketClient();
      //获取总数
      uni.app.getTotalUnReadCount();
      wsClient.onSocketMessageCallback = (res) => {
        if (
          res.handlerType == "1" ||
          res.handlerType == "2" ||
          res.handlerType == "3" ||
          res.handlerType == "4"
        ) {
          //点赞收藏关注
          uni.app.getTotalUnReadCount();
        }
        if (res.handlerType == "5") {
          //获取总数
          uni.app.getTotalUnReadCount();
        }
        if (res.handlerType == "9") {
          //设置角标
          uni.app.setMessageTabBarBadge(res.body.totalUnReadCount);
        }
      };
    });
  },
  onLoad: function () {
    this.showPromotion = graceRequestConfig.showPromotion;
    // 页码加载时第一次加载数据
    // page = 1;
    // this.getdata();
    this.$nextTick(() => {
      this.getIpAddress();
      this.getCategories();
      const query = uni.createSelectorQuery().in(this);
      query
        .select("#header")
        .boundingClientRect((data) => {
          if (data) {
            // console.log('header')
            // console.log( data )
          }
        })
        .exec();
      this.getNotes1();
      this.getNotes2();
      this.loaded = true;

      const user = uni.app.getStorage("user");
      console.log("user:" + JSON.stringify(user));

      // window.apisdk =  new CozeWebSDK.WebChatClient({
      // 	config: {
      // 		bot_id: '7488972042008887335',
      // 	},
      // 	auth: {
      // 		type: 'token',
      // 		token: 'pat_egEHbZtTgkibo3hnZ2PxFnvuLfWH05hGshFn5XiBvTLRNr40sDx1mn0uEV95sHi5',
      // 		onRefreshToken: function () {
      // 			return 'pat_egEHbZtTgkibo3hnZ2PxFnvuLfWH05hGshFn5XiBvTLRNr40sDx1mn0uEV95sHi5'
      // 		}
      // 	},
      // 	userInfo: {
      // 		id: user.authorId,
      // 		url: user.avatarUrl,
      // 		nickname: user.authorName,
      // 	},
      // 	ui: {
      // 		base: {
      // 			icon: 'https://zhijan-video.oss-cn-beijing.aliyuncs.com/exampledir/ai.png',
      // 			layout: 'pc',
      // 			zIndex: 1000,
      // 		},
      // 		footer: {
      // 			isShow:false
      // 		},
      // 		header:{

      // 		},
      // 		chatBot: {
      // 			title: "您的智能AI助手",
      // 			uploadable: false,
      // 			width: 320,
      // 			el: undefined,
      // 			onHide: () => {
      // 				// todo...
      // 			},
      // 			onShow: () => {
      // 				// todo...
      // 			},
      // 		},
      // 	},
      // });
    });
  },
  onReachBottom: function () {
    console.log("我到第" + (this.currentIndex + 1) + "最低端了");
    console.log(this["apiLoadingStatus" + (this.currentIndex + 1)]);
    if (this["apiLoadingStatus" + (this.currentIndex + 1)]) {
      return;
    }
    // 获取加载组件状态看一下是否还能继续加载
    // 保证触底只执行一次加载
    console.log("timer");
    console.log(this["loadMoreTimer" + (this.currentIndex + 1)]);
    if (this["loadMoreTimer" + (this.currentIndex + 1)] != null) {
      clearTimeout(this["loadMoreTimer" + (this.currentIndex + 1)]);
    }
    this["loadMoreTimer" + (this.currentIndex + 1)] = setTimeout(() => {
      var status =
        this.$refs["loadmorecom" + (this.currentIndex + 1)].loadMoreStatus;
      if (status != 0) {
        return null;
      }
      this.$refs["loadmorecom" + (this.currentIndex + 1)].loading();
      // 此处开启加载动画执行加载数据的函数
      this["getNotes" + (this.currentIndex + 1)]();
      // this.swiperHeight = this['swiperHeight'+(this.currentIndex+1)]
      // console.log('赋值了高度 当前currentIndex+1='+ (this.currentIndex+1) +' oonReachBottom监听的数据' + this.swiperHeight)
    }, 50);
  },
  mounted: function () {
    var mountedTimer = null;
    if (mountedTimer != null) {
      clearTimeout(mountedTimer);
    }
    mountedTimer = setTimeout(() => {
      // 01. 获取页面主体高度
      graceJS.getRefs("guiPage", this, 0, (ref) => {
        ref.getDomSize("guiPageBody", (e) => {
          this.swiperHeight = e.height - uni.upx2px(110) - 92.8; //导航栏高度
          this.defaultSwiperHeight = e.height - uni.upx2px(110);
        });
      });
    }, 100);
  },
};
</script>
<style scoped>
.search-fixed-top {
  position: fixed;
  z-index: 999;
  left: 0;
  top: 0;
  width: 100%;
}

/*数值越大屏幕中边距越小 左右模块的宽度*/
.gui-waterfall-item {
  width: 355rpx;
}

.gui-waterfall-items {
  margin-bottom: 15rpx;
}

.gui-block {
  margin-top: 10rpx;
}

/* #ifdef MP */
.search-icon {
  top: 100rpx !important;
  right: 280rpx !important;
}

/* #endif */

/* #ifdef APP-PLUS */
.search-icon {
  top: 80rpx !important;
  right: 120rpx !important;
}

/* #endif */
</style>
